<template>
	<div class="system-iotDeviceGroup-add">
		<!-- 审核充值订单 -->
		<el-dialog v-model="isShowDialog" width="700px" :close-on-click-modal="false" :destroy-on-close="true">
			<template #header>
				<div>审核充值订单</div>
			</template>
			<el-form ref="formRef" :model="formData" label-width="120px">
				<el-row>
					<el-col :span="12"><el-form-item label="订单号：" >{{ formData.id }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="企业名称：" >{{ formData.companyName }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="汇款户名：" >{{ formData.remitName }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="汇款银行：" >{{ formData.remitBank }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="汇款银行账号：" >{{ formData.remitAccount }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="支付金额：" >{{ formData.amount }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="状态：" >{{ formData.orderStatusTxt }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="创建时间：" >{{ formData.createTimeTxt }}</el-form-item></el-col>
					<el-col :span="12"><el-form-item label="操作人：" >{{ formData.createBy }}</el-form-item></el-col>
				</el-row>
			</el-form>
			<template #footer>
				<div class="dialog-footer">
					<el-button @click="onCancel">取 消</el-button>
					<el-button type="danger" @click="onSubmit('REFUSE')" :loading="loading1">拒 绝</el-button>
					<el-button type="primary" @click="onSubmit('COMPLETE')" :loading="loading">通 过</el-button>
				</div>
			</template>
		</el-dialog>
	</div>
</template>
<script lang="ts">
import { reactive, toRefs, defineComponent, ref, unref, getCurrentInstance } from 'vue';
import { ElMessageBox, ElMessage, FormInstance, UploadProps } from 'element-plus';
import { editPayOrderApi } from '@/api/financeCenter/rechargeRecord';
export default defineComponent({
	name: 'rechargeRecordEdit', //企业充值审核
	components: {},
	props: {
		seatList: {
			type: Array,
			default: () => []
		}
	},
	setup(props, { emit }) {
		const formRef = ref<HTMLElement | null>(null);
		const menuRef = ref();
		const state = reactive({
			loading: false,
			loading1:false,
			isShowDialog: false,
			formData: {
				id: undefined,
				companyName: undefined,
				remitName: undefined,
				createBy: undefined,
				createTimeTxt: undefined,
				amount: undefined,
				remitAccount: undefined,
				remitBank: undefined,
				orderStatusTxt:undefined,
			},
		});
		// 打开弹窗
		const openDialog = (row) => {
			resetForm();
			state.formData = row
			console.log(state.formData );
			
			state.isShowDialog = true;
		};
		// 关闭弹窗
		const closeDialog = () => {
			state.isShowDialog = false;
		};
		// 取消
		const onCancel = () => {
			closeDialog();
		};
		// 提交
		const onSubmit = (orderStatus) => {
			const formWrap = unref(formRef) as any;
			if (!formWrap) return;
			formWrap.validate((valid: boolean) => {
				if (valid) {
					let txt='通过'
					orderStatus=='REFUSE'?state.loading1=true:state.loading = true
					if(orderStatus=='REFUSE')txt='拒绝'
					let obj={
						id:state.formData.id,orderStatus
					}

					//修改
					editPayOrderApi(obj)
						.then(() => {
							ElMessage.success(`${txt}成功`);
							closeDialog(); // 关闭弹窗
							emit('getList');
						})
						.finally(() => {
							state.loading = false;
							state.loading1 = false;
						});
				}
			});
		};
		const resetForm = () => {
			state.formData = {
				id: undefined,
				companyName: undefined,
				remitName: undefined,
				createBy: undefined,
				createTimeTxt: undefined,
				amount: undefined,
				remitAccount: undefined,
				remitBank: undefined,
				orderStatusTxt:undefined,
			};
		};
		return {
			openDialog,
			closeDialog,
			onCancel,
			onSubmit,
			resetForm,
			menuRef,
			formRef,
			...toRefs(state),
		};
	},
});
</script>
<style scoped></style>
